import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react';

import {
    Button,
    DatePicker,
    Form,
    Input,
    Modal,
    Radio,
    Tag,
    Select,
    InputNumber,
    message,
    Row,
    Col,
    Tree,
} from 'antd';
import { modalLayoutLg, modalLayoutSm } from '@/config/layout';
import { request } from 'umi';
const SelectComp = (props: any, refs: any) => {
    const [code, setCode] = useState('');
    const [isModalVisible, setIsModalVisible] = useState(false);
    const [treeData, settreedata] = useState([]);
    const [value, setvalue] = useState('')
    //显示弹窗
    const showModal = () => {
        setIsModalVisible(true);
    };

    //取消
    const handleCancel = () => {
        setIsModalVisible(false);
        setCode('');
        props.callback && props.callback();
    };
    //确定
    const handleOk = () => {
        if (value == '') {
            message.error('必须选择一个')
        } else {
            console.log(value)
        }
    };
    useImperativeHandle(refs, () => ({
        init: (id: any, record: any) => {
            setCode(id);

            showModal();
            // setfileList([]);
        },
    }));

    const getdata = () => {
        request('/data/dynamic/query', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            data: {
                apiID: 'GL_001'
            }
        }).then((res) => {
            let data = res?.data?.data;
            let obj = {};
            data.sort((a, b) => {
                return a.org_level - b.org_level;
            });
            data.forEach((item) => {
                if (item?.up_org_code == '') {
                    obj[item?.org_code] = item;
                }
            });
            data.forEach((item) => {
                if (item?.up_org_code) {
                    obj = handleObj(obj, item);
                }
            });
            console.log(obj);
            let arr = handleData(obj);
            settreedata(arr);
        });
    };
    const handleObj = (obj, item) => {
        if (obj[item?.up_org_code]) {
            if (!obj[item?.up_org_code]['children']) {
                obj[item?.up_org_code]['children'] = {};
            }

            obj[item?.up_org_code]['children'][item?.org_code] = item;
        } else {
            for (let i in obj) {
                if (obj[i]['children']) {
                    obj[i]['children'] = handleObj(obj[i]['children'], item);
                }
            }
        }

        return obj;
    };
    const handleData = (obj) => {
        let arr = [];
        for (let i in obj) {
            let item = {
                title: obj[i]['org_name'],
                key: obj[i]['org_code_id'] + ''
            };
            if (obj[i]['children']) {
                item['children'] = handleData(obj[i]['children']);
            }

            arr.push(item);
        }
        return arr;
    };
    useEffect(() => {
        getdata()
    }, [])
    return (
        <Modal
            title={'选择'}
            visible={isModalVisible}
            onOk={handleOk}
            onCancel={handleCancel}
            centered
            width={1000}
            maskClosable={false}
            bodyStyle={{
                maxHeight: window.innerHeight - 150,
                overflowY: 'auto',
            }}
        >
            {
                treeData.length > 0 && <Tree
                    treeData={treeData}
                    defaultCheckedKeys={[value]}
                    selectedKeys={[value]}
                    defaultExpandAll
                    onSelect={(selectedKeys, e) => {
                        setvalue(selectedKeys[0])
                    }}
                />
            }
        </Modal>
    );
};
const SelectCom = forwardRef(SelectComp);
export default SelectCom;
